<template>
	<view class="container">
		<view class="tips">
			<image src="../../static/image/ref1.png" mode="aspectFill" v-if="refund_status==1"></image>
			<image src="../../static/image/ref2.png" mode="aspectFill" v-else></image>
			<view class="t">
				{{refund_status==1?"退款中":"退款成功"}}
			</view>
			<view class="p">
				{{refund_status==1?"您的退款申请已提交，退款金额将在1-2个工作日原路退回":"您的付款金额已原路退回，期待您的下次光临"}}
				您的退款申请已提交，退款金额将在1-2个工作日原路退回
			</view>
			<view class="price" v-if="refund_status==2">
				￥<text >{{price}}</text>
			</view>
			<view class="btn" @click="back">
				查看订单
			</view>
			<view class="home" @click="gohome">
				返回首页
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				id: "",
				refund_status: "",
				status: ""
			}
		},
		onLoad(o) {
			this.id = o.id
			this.refund_status = o.refund_status
			this.status = o.status
		},
		methods: {
			back() {
				uni.navigateBack({
					delta: 1
				})
			},
			gohome() {
				uni.switchTab({
					url: '/pages/index/index'
				})
			},
		}
	}
</script>

<style lang="less" scoped>
	.container {
		.tips {
			display: flex;
			align-items: center;
			justify-content: center;
			text-align: center;
			flex-direction: column;
			padding-top: 80rpx;

			image {
				width: 88rpx;
				height: 88rpx;
			}

			.t {
				margin-top: 20rpx;
				line-height: 60rpx;
				height: 60rpx;
				font-weight: bold;
				font-size: 40rpx;
				color: #000000;
				text-align: center;

			}


			.p {
				margin-top: 30rpx;
				line-height: 40rpx;
				height: 40rpx;
				
				font-size: 24rpx;
				color: #8E8E8E;
				text-align: center;

			}

			.price {
				line-height: 60rpx;
				height: 60rpx;
				
				font-size: 24rpx;
				color: #000;
				text-align: center;
				margin-top: 30rpx;

				text {
					font-weight: 600;
					font-size: 72rpx;
				}
			}

			.btn {
				margin-top: 100rpx;
				width: 320rpx;
				height: 80rpx;
				line-height: 80rpx;
				background: #000000;
				border-radius: 40rpx 40rpx 40rpx 40rpx;
				font-size: 28rpx;
				color: #fff;
				text-align: center;
			}

			.home {
				margin-top: 50rpx;
				line-height: 40rpx;
				height: 40rpx;
				
				font-size: 30rpx;
				color: #979797;
				text-align: center;

			}
		}
	}
</style>